<template>
  <div class="preview-work-order-form form-generator-wrap">
    <form-parser
      ref="pcFormParserRef"
      :levelName="levelName"
      :templateId="id"
      is-preview
    ></form-parser>
    <!-- 测试代码 -->
    <el-button v-if="env === 'development'" @click="onSubmit">提交</el-button>
  </div>
</template>

<script>
import {
  getActivitys,
  getTemplateById,
  lesseeList,
} from "@/api/workOrder/template";
import store from "@/components/FormGenerator/store/tableSheet.js";
import { cloneDeep } from "lodash";
export default {
  name: "PreviewTemplate",
  props: ["id"],
  components: {
  },
  data() {
    return {
      env: process.env.NODE_ENV,
      type: "pc",
      form: {
        templateApplies: [
          {
            companyCode: "",
            companyName: "",
          },
        ],
        nodeOverdues: [],
        nodeTransmits: [],
      },
      systems: [],
      levelName: undefined,
    };
  },
  created() {
    if (this.id !== undefined) {
      this.getDetail();
    }
  },
  mounted() {},
  methods: {
    async getDetail() {
      let { data } = await getTemplateById(this.id);
      let { data: resData } = await lesseeList();
      store.lesseeCode = data.systemName;
      this.form = data;
      // 根据适用系统systemName码值 转换为对应的适用系统中文值
      this.form.systemName = resData.find((item) => {
        return item.code === data.systemName;
      }).lesseeName;
      // console.log(data);
      ["pcFormParserRef", "mobileFormParserRef"].forEach((ref) => {
        //TODO: 需要做过滤显示某些组件,可以在这里写代码实现
        /*
        this.$refs[ref].setModules(data.modules, (item, index, card, cardIndex)=>{
          return true
        })
        if(this.$refs[ref]){
          this.$refs[ref].setModules(data.modules);
        }
        */
      });
    },
    onSubmit(data) {
      let ref = this.type === "pc" ? "pcFormParserRef" : "mobileFormParserRef";
      this.$refs[ref].validate()
        .then((data) => {
          console.log("校验成功", data);
        })
        .catch((err) => {
          console.log("校验失败", err);
        });
    },
  },
  watch: {},
  computed: {
  },
};
</script>

<style lang="scss">
@import url('~@/assets/styles/edit-preview-template.scss');
.preview-work-order-form{
  .el-form {
    padding: 10px 0 5px 10px;
    margin-bottom: 10px;
    border-bottom: 1px solid #f1e8e8;
    .el-button--mini {
      padding: 5px 15px;
    }
    .el-form-item--mini.el-form-item {
      margin-bottom: 10px;
    }
  }
  .row-2 {
    .el-form-item--mini.el-form-item {
      margin-bottom: 5px;
    }
  }
  .el-divider__text {
    background-color: #F0F2F5;
  }
}
</style>
